<template>
    <div>
        <a href="Adds">添加</a>
        <a href="https://localhost:7081/api/Shan/Dao">导出</a>
        项目名称:
        <input type="text" v-model="index.names">
        <input type="button" value="查询" @click="getdate">
        <input type="button" value="批量修改状态" @click="Plzt">
       <table class="table">
          <thead>
              <tr>
                <td><input type="checkbox" v-model="quan" @change="qx"></td>
                <td>项目名称</td>
                <td>项目编号</td>
                <td>服务时长</td>
                <td>服务人数</td>
                <td>佣金</td>
                <td>项目说明</td>
                <td>状态</td>
                <td>操作</td>
              </tr>
          </thead>
          <tbody>
            <tr v-for="a in date">
                <td><input type="checkbox" v-model="fan":value="a.shanId"></td>
                <td>{{a.shanName}}</td>
                <td>{{a.shanBian}}</td>
                <td>{{a.shanShi}}</td>
                <td>{{a.shanRen}}</td>
                <td>{{a.shanYong}}</td>
                <td>{{a.shanShuo}}</td>
                <td>{{a.shanStart==1?'启用':'禁用'}}</td>
                <td>
                    <input type="button" value="删除" @click="Ljdel(a.shanId)">
                </td>
              </tr>
          </tbody>
       </table>

一共{{indexs.count}}条,显示{{index.pagesize}}条,一共{{indexs.pagecount}}页,当前第{{index.pageindex}}页
<input type="button" value="首页" @click="fenye(1)">
<input type="button" value="上一页" @click="fenye(2)">
<input type="button" v-for="a in indexs.pagecount":value="a" @click="shuzi(a)">
<input type="button" value="下一页" @click="fenye(3)">
<input type="button" value="尾页" @click="fenye(4)">

<input type="number" v-model="index.pagesize">
<input type="button" value="跳转" @click="tiao">

<select v-model="index.pagesize" @click="set">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref , onMounted } from 'vue';
import { useRouter } from 'vue-router';

const fenye=(val:any)=>{
if(val==1){
index.value.pageindex=1;
getdate()
}
if(val==2 && index.value.pageindex>1){
index.value.pageindex--;
getdate()
}
if(val==3 && index.value.pageindex<indexs.value.pagecount){
index.value.pageindex++;
getdate()
}
if(val==4){
index.value.pageindex=indexs.value.pagecount
getdate()
}
}

const set=()=>{
    getdate()
}

const shuzi=(val:any)=>{
    index.value.pageindex=val;
    getdate();
}

const tiao=()=>{
    if(index.value.pageindex<1 || index.value.pageindex>indexs.value.pagecount){
    alert("页码无效")
    return;
    }
    getdate()
}


const index = ref({
    pageindex : 1,
    pagesize : 3,
    names : ""
})

const indexs = ref({
    count : 0,
    pagecount:0
})

onMounted(()=>{
    getdate()
})

const date = ref([
    {
    "shanId": 1,
    "shanName": "激励增强训练",
    "shanBian": "13567889",
    "shanShi": "2",
    "shanRen": "3",
    "shanYong": "900",
    "shanShuo": "是一种训练方式",
    "shanStart": 1,
    "shanDele": 1
  },
])

const getdate=()=>{
    axios.get("/api/Shan/GetAllAsyncList",{params:index.value}).then(res=>{
        date.value = res.data.pagecount

        indexs.value.count = res.data.count;
        indexs.value.pagecount = Math.ceil(indexs.value.count/index.value.pagesize);
    })
}

const quan = ref(false)
const fan = ref([])

const qx=()=>{
    if(quan.value){
     date.value.forEach(res=>{
        fan.value.push(res.shanId)
     })
    }
    else{
        fan.value=[];
    }
}

const Ljdel=(mid:any)=>{
    if(!confirm("你确定要删除吗?")){
    return
    }
    axios.get("/api/Shan/LjDele",{params:{id:mid}}).then(res=>{
    if(res.data>0){
    alert("删除成功")
    getdate()
    }
    else{
    alert("删除失败")
    }
    })
}

const Plzt=()=>{
    if(!confirm("你确定要修改吗?")){
    return
    }
    axios.get("/api/Shan/Plzt",{params:{idstring:fan.value.toString()}}).then(res=>{
    if(res.data>0){
    alert("修改成功")
    getdate()
    }
    else{
    alert("修改失败")
    }
    })
}

</script>

<style scoped>

</style>